<div class="logo">
  <img src="../../assets/img/logo.png">
</div>
<h3>让您种地更简单 高产更放心</h3>

<form #user="ngForm" (ngSubmit)="logForm(user)">
  <md-input-container class="example-full-width ">
    <!--在使用-->
      <input mdInput  (keyup)="keyupHandler1($event)" type="tel" #tel name="mobile" placeholder="请输入手机号" [ngModel]="user.mobile" required minlength="11" maxlength="11" value="mobile" (input)="telGet()">
        <span *ngIf="user.controls.mobile?.valid" class="label-success">有效</span>
        <div [hidden]="user.controls.mobile?.valid || user.controls.mobile?.pristine" class="alert">
            <p *ngIf="user.controls.mobile?.errors?.minlength">手机号长度必须为11</p>
            <p *ngIf="user.controls.mobile?.errors?.required">必须输入手机号</p>
        </div>
      <md-hint align="end">{{tel.value.length}}/11</md-hint>
  </md-input-container>
  <a md-button class="positionrem" (click)="userPostAddUser()"  (click) = "userGet()">获取验证码</a>
  <div  *ngIf="loading">
     成功获取验证码
  </div>
  <md-input-container class="example-full-width" >
      <input mdInput type="tel" name="code" #code  placeholder="请输入验证码" value="code" required [ngModel]="user.code"  minlength="6" maxlength="6">
      <span *ngIf="user.controls.code?.valid" class="label label-success">有效</span>
      <div [hidden]="user.controls.code?.valid || user.controls.mobile?.pristine" class="alert alert-danger">
          <p *ngIf="user.controls.code?.errors?.minlength">验证码必须为6位数</p>
          <p *ngIf="user.controls.code?.errors?.required">只允许输入数字</p>
      </div>
      <md-hint align="end">{{code.value.length}}/6</md-hint>
  </md-input-container>
  <div class="button-row">
      <button md-raised-button type="button"  [disabled]="!user.valid" [disabled]="user.valid==0" [routerLink]="['/suc']" (click)="userGet()" >立即绑定</button>
  </div>

</form>
<footer>
  <div>
    若未收到验证码或无法绑定 请拨打 <em>400-816-9956</em>
  </div>
</footer>
<!--(input) ="telCheck(tel.value)"-->
<!--
  <div class="picture">
    <div><img/>这里是验证码图片</div>

   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
   <input type="text" class="form-control" placeholder="">
  </div>
-->
